@extends('web.layouts.app')

@section('styles')
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('resources/web/css/base.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('resources/web/css/ucenter.css') }}">
    <!-- <link rel="stylesheet" href="//cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.css"> -->
@endsection

@section('content')
    <div class="uc-wrap swrap mt20">
        <div class="uc-side L">
            <div class="uc-nav">
                <ul>
                    @include('web.user_center.menu')
                </ul>
            </div>
        </div>
        <div class="uc-main uc-mainbg R">
            <div class="plr10 user-msg-wrap">
                <h3 class="uc-main-title">站内信</h3>
                <div class="msg-status-menu">
                    <a {{ empty($query_message_type)?"class=active":"" }} href="{{ action('MessageController@index') }}">全部消息</a><span>|</span>
                    @foreach($message_types as $message_type)
                        <a {{ $query_message_type==$message_type->code?"class=active":"" }} href="{{ action('MessageController@index',[$message_type->code]) }}">{{ $message_type->name }}</a><span>|</span>
                    @endforeach
                </div>
                <ul class="user-msg-list"
                    data-del-msg-url="{{ action('MessageController@delete_msg') }}"
                    data-read-msg-url="{{ action('MessageController@read_msg') }}"
                    data-read-all-msg-url="{{ action('MessageController@read_all_msg') }}"
                    data-clear-msg-url="{{ action('MessageController@clear_all_msg') }}"
                    data-msg-type="{{ $query_message_type }}">
                    @foreach($user_messages as $user_message)
                        <li data-msg-id="{{ $user_message->id }}">
                            <div class="title-box">
                                <a class="title L {{ $user_message->readed==1?'visited':'' }}" href="javascript:readMessage('{{ $user_message->id }}','{{ $user_message->title }}');">{{ $user_message->title }}</a>
                                <span class="time">{{ $user_message->published_at }}</span>
                                <a class="delete" title="删除" href="javascript:deleteMessage('{{ $user_message->id }}','{{ $user_message->title }}');">×</a>
                            </div>
                            <div class="info-box">
                                {!! $user_message->content !!}
                            </div>
                        </li>
                    @endforeach
                </ul>
                <div class="no-msg-tips hide">还没有站内消息~</div>
                <div class="user-msg-page-wrap clearfix">
                    <div class="msg-tool-bar L">
                        <a id="J_visited_msg" href="javascript:readAllMessage();">全部置为已读</a><span>|</span>
                        <a id="J_clear_all" href="javascript:clearAllMessage();">清空所有消息</a>
                    </div>
                    <div class="uc-page-box text-right R">
                        <span class="total">共 <em>{{$user_messages->total()}}</em> 条数据</span>
                        @for($i=1;$i<=$user_messages->lastPage();$i++)
                            <a class="{{$user_messages->currentPage()==$i?"current":""}}" href="{{ $user_messages->url($i) }}">{{ $i }}</a>
                        @endfor
                        <span>{{ $user_messages->currentPage() }}/{{ $user_messages->lastPage() }}页</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
<script src="{{ asset('resources/web/js/index.js') }}"></script>
<script type="text/javascript" src="{{ asset('resources/web/js/jquery.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('resources/web/js/ucenter.js') }}"></script>
<script type="text/javascript" src="{{ asset('resources/web/plugins/datePicker/WdatePicker.js') }}"></script>
<!-- <script src="//cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.js"></script> -->
    <script>
        //删除一条指定消息
        function deleteMessage (id,title) {
                        $.ajax({
                            headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                            url:$(".user-msg-list").attr('data-del-msg-url'),
                            data:{'id':id},
                            type:'post',
                            success:function(){
                                swal("温馨提示", "删除消息 <"+title+"> 成功!", "success");
                                var $li =  $('[data-msg-id='+id+']');
                                $li.slideUp('fast',function(){
                                    $li.remove();
                                });
                            },
                            error:function(data){
                                sweetAlert("Error", "Error Code: "+data.status+" "+data.statusText+"\n删除消息 <"+title+"> 失败...", "error");
                            }
                        });
        }
        //将指定的消息标记为已读
        function readMessage (id,title) {
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                url:$(".user-msg-list").attr('data-read-msg-url'),
                data:{'id':id},
                type:'post',
                success:function(){
                },
                error:function(data){
                    sweetAlert("Error", "Error Code: "+data.status+" "+data.statusText+"\n消息 <"+title+"> 置为已读失败...", "error");
                }
            });
        }
        function readAllMessage () {
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                url:$(".user-msg-list").attr('data-read-all-msg-url'),
                data:{'message_type':$(".user-msg-list").attr('data-msg-type')},
                type:'post',
                success:function(){
                },
                error:function(data){
                    sweetAlert("Error", "Error Code: "+data.status+" "+data.statusText+"\n消息全部置为已读失败...", "error");
                }
            });
        }
        function clearAllMessage(){
            swal({
                    title: "温馨提示",
                    text: "是否确定要清空所有消息,不可恢复!",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "是的,我确定",
                    closeOnConfirm: false,
                    cancelButtonText:"再想想"
                },
                function(){

                    $.ajax({
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                        url:$(".user-msg-list").attr('data-clear-msg-url'),
                        data:{'message_type':$(".user-msg-list").attr('data-msg-type')},
                        type:'post',
                        success:function(){
                            swal("温馨提示", "已经清空了当前分类下存在的全部消息", "success");
                            $('.user-msg-list li').remove();
                            $('.no-msg-tips').removeClass('hide');
                            $('.user-msg-page-wrap').hide();
                        },
                        error:function(data){
                            sweetAlert("Error", "Error Code: "+data.status+" "+data.statusText+"\n清空全部消息失败...", "error");
                        }
                    });
                });
        }
    </script>
@endsection